<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>积分翻倍</title>
	<meta name="renderer" content="webkit|ie-comp|ie-stand">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8" />
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<!--<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />-->
	<script src="__JS__/phone.js" type="text/javascript" charset="utf-8"></script>
	<script src="__JS__/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
	<script src="__JS__/vue/npmvue.js" type="text/javascript" charset="utf-8"></script>
	<link rel="stylesheet" type="text/css" href="__CSS__/common/common.css" />
	<link rel="stylesheet" type="text/css" href="__CSS__/index/index.css" />
	<link rel="stylesheet" type="text/css" href="__CSS__/index/coupon.css" />
	<!--{load href="__JS__/jquery.form.js" /}-->
	{load href="__LIB__/layui/layui.js" /}
	{load href="__LIB__/layui/css/layui.css" /}
</head>

<body>
	<div id="app">
		<div class="backImage">
			<img src="__STATIC__/images/backImg.png" />
		</div>
		<!--<div class="header">
			</div>-->
		<!--<ul class="bannerList">
				<li v-for="(item,index) in bannerList">
					<img :src="item.banner_img" />
				</li>
			</ul>-->

		<div class="layui-carousel bannerList" id="test2" style="margin-top: 15px;">
			<div carousel-item="" id="lunbo">
				{foreach $banners as $key => $value}
				<div>
					<img src="{$value.banner_img}" />
				</div>
				{/foreach}
			</div>
		</div>

		<div class="actionStatus">
			<div class="actionName">
				<img src="__STATIC__/images/contentIcon.png" /> {{actionInfo.title}}
			</div>
			<div class="actionTime">
				<img src="__STATIC__/images/timeIcon.png" />
				活动时间：{{actionInfo.starttime}} ~ {{actionInfo.endtime}}
			</div>
			<div class="rightImg">
				<p v-if='datetime >= value.starttime && datetime <= value.endtime'>进行中</p>
				<p v-if='datetime < value.starttime'>未开始</p>
				<p v-if='datetime > value.endtime'>已结束</p>
				<img class="img" src="__STATIC__/images/timeDiv.png" />
			</div>
		</div>
		<ul class="couponList">
			<div class="leftDot dot"></div>
			<div class="rightDot dot"></div>
			<li v-for="(item,index) in couponList" @click="selectCoupon(item,event)">
				<div class="left">
					<p>{{item.point}}<span>兑换</span>{{item.certime}}</p>
					<!-- <p>{{item.validtime}}</p> -->
					<div class="real_stock">（仅剩：{{item.real_stock}}个）</div>

				</div>
				<!--<div class="left">
						<p>{{item.real_stock}}</p>
						<p>{{item.point}}</p>
					</div>-->
			</li>
		</ul>
		<div class="actionInfo">
			<div class="leftDot dot"></div>
			<div class="rightDot dot"></div>
			<div class="title">
				<img src="__STATIC__/images/contentIcon.png" /> 活动详情
			</div>
			<div class="info" v-html="actionInfo.rule">
			</div>
		</div>
		<div class="exchangeBtnDiv">
			<div class="leftDot dot"></div>
			<div class="rightDot dot"></div>
			<div class="title">
			</div>
			<div class="btn" @click="beforegetCoupon()">
				<p>兑换</p>
			</div>
		</div>
		<div class="loadingDiv" v-show="isLoading">
			<div class="loadingImg">
				<img src="__STATIC__/images/loading.gif" />
				<p>加载中，请稍后...</p>
			</div>
		</div>
	</div>
</body>
<script>

</script>
<script>
	var vm = new Vue({
		el: "#app",
		data() {
			return {
				actionInfo: {},
				couponList: [],
				selectedCoupon: 0,
				bannerList: [],
				cardNo: '',
				score: '',
				isLoading: true,
				actionList: [],
				datetime: '',
				value: '',

			}
		},
		created() {
			//				根据手机号获取会员卡号
			this.getCard();
			//				获取活动列表
			this.getActions();
			this.datetime = this.getDate();

			this.getInfo();
			//轮播插件
			layui.use(['carousel', 'form'], function () {
				var carousel = layui.carousel,
					form = layui.form;
				//改变下时间间隔、动画类型、高度
				carousel.render({
					elem: '#test2',
					interval: 3000,
					anim: 'fade',
					height: '280px'
				});
			});
		},
		methods: {
			getCard() {
				//根据手机号获取会员卡号
				var that = this;
				$.ajax({
					type: "post",
					//					url:"/api/Getinfo/getVipCardNo",
					url: "https://tjdq.sylwtech.cn/api/Getinfo/getVipCardNo",
					async: false,
					data: {
						phone: '{$mobile}'
					},
					dataType: "json",
					success: function (res) {
						console.log('getVipCardNo', res);
						sessionStorage.vipCardNo = res;
						that.cardNo = res;
						//根据会员卡号获取消费积分
						that.getScore(res);
					}
				});
			},
			getScore(cardNumber) {
				//根据会员卡号获取消费积分
				var that = this;
				$.ajax({
					type: "post",
					url: "https://tjdq.sylwtech.cn/api/Getinfo/getScore",
					async: true,
					data: {
						card: cardNumber
					},
					dataType: "json",
					success: function (res) {
						that.score = res;
						sessionStorage.vipScore = res;
						console.log('getScore', res);
					}
				});
			},
			getActions(mobile) {
				//					获取活动列表
				var that = this;
				$.ajax({
					type: "post",
					url: "/api/Getinfo/getActions",
					async: true,
					data: {
						mobile: '{$mobile}'
					},
					dataType: "json",
					success: function (res) {
						console.log(res)
						that.actionList = res.data;

						console.log(that.actionList);
						let x = that.actionList
						let value = ''
						for (let i in x) {
							if (x[i].id == '{$actionid}') {
								value = x[i]
							}
						}
						that.value = value

					}
				});
			},
			getInfo() {
				//获取该活动券列表及广告列表
				var that = this;
				$.ajax({
					type: "post",
					url: "/api/Getinfo/getActionInfo",
					async: true,
					data: {
						mobile: '{$mobile}',
						actionId: '{$actionid}'
					},
					dataType: "json",
					success: function (res) {
						console.log(res)
						that.isLoading = false;
						that.cardNo = res.cardNo;
						that.score = res.score;
						that.couponList = res.data.couponList;
						that.bannerList = res.data.bannerList;
						that.actionInfo = res.data.actionInfo;
					}
				});
			},
			selectCoupon(item, ele) {
				this.selectedCoupon = item;
				console.log(ele.currentTarget)
				$(ele.currentTarget).css('border', '3px solid #ff0000')
				$(ele.currentTarget).siblings().css('border', '3px solid #ffd3d3')
			},

			beforegetCoupon() {
				let that = this
				let value = that.value

				var datetime = that.getDate();
				console.log(value.starttime)
				console.log(datetime)
				console.log(value.endtime)


				if (datetime >= value.starttime && datetime <= value.endtime) {
					//判断该用户参与次数是否超过每人应参加该活动次数
					if (value.joined_num < value.join_number) {
						if (value.joined_today < value.join_eachday) {

							that.getCoupon()

						} else {
							window.alert("您已达到此活动每天的参与次数")
						}
					} else {
						window.alert("每人限兑1次\n您已完成兑换")
					}
				} else {

					if (datetime < value.starttime) {
						window.alert('该活动未开始');
					}

					if (datetime > value.endtime) {
						window.alert('该活动已结束');
					}

				}

			},
			getCoupon() {
				var that = this;

				console.log(that.selectedCoupon);
				//					console.log()
				var value = that.selectedCoupon;
				if (value == 0) {
					window.alert("您还未选择积分券");
				} else {
					//判断库存 real_stock > 0
					if (value.real_stock > 0) {
						//判断该用户领取是否超过规定次数  got_num >= people_num
						if (value.got_num < value.people_num) {
							if (value.got_today < value.get_eachday) {
								//								判断用户积分是否足够兑换此券
								if (sessionStorage.vipScore >= value.point) {
									that.isLoading = true;
									//								领取券
									$.ajax({
										type: "post",
										url: "/api/Active/exchange",
										async: true,
										data: {
											mobile: '{$mobile}',
											actionId: '{$actionid}',
											couponId: value.id,
											score: value.point,
											CardHyNo: sessionStorage.vipCardNo,
										},
										dataType: "json",
										success: function (res) {
											that.isLoading = false;
											console.log(res)
											if (res.code) {
												window.alert(res.msg);
												window.location.href = 'http://m.mallcoo.cn/a/custom/10292/hx/cashcardlist';
											} else {
												window.alert(res.msg);
												window.location.href = 'http://m.mallcoo.cn/a/custom/10292/hx/cashcardlist';
											}
										}
									});
								} else {
									window.alert('您的积分不足')
								}
							} else {
								window.alert('您已达到此券今天的领取次数')
							}
						} else {
							window.alert('每人限兑1次\n您已完成兑换')
						}
					} else {
						window.alert('此档已兑完')
					}
				}
			},
			getDate() {
				var myDate = new Date();
				var year2 = myDate.getYear();        // 获取当前年份(2位)
				var year4 = myDate.getFullYear();    // 获取完整的年份(4位,1970-????)
				var month = myDate.getMonth() + 1;       // 获取当前月份(0-11,0代表1月)
				var day = myDate.getDate();        // 获取当前日(1-31)
				var week = myDate.getDay();         // 获取当前星期X(0-6,0代表星期天)
				var time = myDate.getTime();        // 获取当前时间(从1970.1.1开始的毫秒数)
				var hour = myDate.getHours();       // 获取当前小时数(0-23)
				var minute = myDate.getMinutes();     // 获取当前分钟数(0-59)
				var seconds = myDate.getSeconds();     // 获取当前秒数(0-59)
				var millisecond = myDate.getMilliseconds();    // 获取当前毫秒数(0-999)
				var dates = myDate.toLocaleDateString();     // 获取当前日期
				var mytime = myDate.toLocaleTimeString();     // 获取当前时间
				var datetime = myDate.toLocaleString();        // 获取日期与时间
				if (month < 10) {
					month = "0" + month;
				}
				if (day < 10) {
					day = "0" + day;
				}
				if (hour < 10) {
					hour = "0" + hour;
				}
				if (minute < 10) {
					minute = "0" + minute;
				}
				if (seconds < 10) {
					seconds = "0" + seconds;
				}
				var dateTime = year4 + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + seconds;
				//					console.log(dateTime);
				return dateTime;
			}
		}
	})
</script>
<script type="text/javascript">
	window.alert = function (name) {
		var iframe = document.createElement("IFRAME");
		iframe.style.display = "none";
		iframe.setAttribute("src", 'data:text/plain,');
		document.documentElement.appendChild(iframe);
		window.frames[0].window.alert(name);
		iframe.parentNode.removeChild(iframe);
	};
</script>

</html>